<!DOCTYPE html>
<html lang="en">
<title>开单详情</title>
<#import "/layout/layout.html" as body/>
<@body.page>
<style>
    .padding-top-30 { padding-top: 30px; }
    .gallery-box img{
        width: 100%;
        max-width: 150px;
    }
</style>
<section>
    <div class="row wrapper border-bottom white-bg page-heading">
        <div class="col-lg-10">
            <h2>会员列表</h2>
            <ol class="breadcrumb">
                <li class="active"><strong>开单详情</strong></li>
            </ol>
        </div>
    </div>
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-lg-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title overflow">
                        <h5 class="pull-left">开单详情</h5>
                    </div>
                    <div class="ibox-content form-horizontal">
                        <!---->
                        <h3 class="padding-top-30">收款人基本信息</h3>
                        <div class="hr-line-dashed"></div>
                        <h4 class="col-md-offset-1">收款人：${orderDetail.cashierName!}</h4>
                        <div class="hr-line-dashed"></div>
                        <h4 class="col-md-offset-1">手机号码：${orderDetail.cashierMobile!}</h4>
                        <div class="hr-line-dashed"></div>
                        <h4 class="col-md-offset-1">收款时间：${orderDetail.payTime!}</h4>
                        <div class="hr-line-dashed"></div>
                        <!---->
                        <h3 class="padding-top-30">开单内容</h3>
                        <div class="hr-line-dashed"></div>
                        <h4 class="col-md-offset-1">项目：${orderDetail.serviceName!}</h4>
                        <div class="hr-line-dashed"></div>
                        <h4 class="col-md-offset-1">购买月数：${orderDetail.month!}个月</h4>
                        <div class="hr-line-dashed"></div>
                        <h4 class="col-md-offset-1">赠送月数：${orderDetail.giveMontCount!}个月 </h4>
                        <div class="hr-line-dashed"></div>
                        <h4 class="col-md-offset-1">赠送餐券：${orderDetail.mealCount!}张</h4>
                        <div class="hr-line-dashed"></div>
                        <h4 class="col-md-offset-1">赠送金额：￥${orderDetail.accountAmount!}</h4>
                        <div class="hr-line-dashed"></div>
                        <h4 class="col-md-offset-1">金额：￥${orderDetail.amount!}</h4>
                        <div class="hr-line-dashed"></div>
                        <h4 class="col-md-offset-1">用户：${orderDetail.userNickName!}（${orderDetail.userName!}）</h4>
                        <div class="hr-line-dashed"></div>
                        <h4 class="col-md-offset-1">用户手机号：${orderDetail.userMobile!}</h4>
                        <div class="hr-line-dashed"></div>
                        <!---->
                        <h3 class="padding-top-30">图片信息</h3>
                        <div class="hr-line-dashed"></div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">刷卡票据图片</label>
                            <div class="col-sm-10">
                                <div class="gallery-box">
                                	<#if orderDetail.billImg ??>
                                		<#list orderDetail.billImg as list>
	                                		<a href="${list.imgUrl!}" data-gallery="">
		                                        <img src="${list.imgUrl!}">
		                                    </a>
	                                	</#list>
                                	</#if>
                                    <!-- <a href="../img/gallery/1.jpg" data-gallery="">
                                        <img src="../img/gallery/1s.jpg">
                                    </a>
                                    <a href="../img/gallery/2.jpg" data-gallery="">
                                        <img src="../img/gallery/2s.jpg">
                                    </a>
                                    <a href="../img/gallery/3.jpg" data-gallery="">
                                        <img src="../img/gallery/3s.jpg">
                                    </a>
                                    <a href="../img/gallery/4.jpg" data-gallery="">
                                        <img src="../img/gallery/4s.jpg">
                                    </a> -->
                                </div>
                            </div>
                        </div>
                        <div class="hr-line-dashed"></div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">合同图片</label>
                            <div class="col-sm-10">
                                <div class="gallery-box">
                                	<#if orderDetail.contractImg ??>
                                		<#list orderDetail.contractImg as imgs>
	                                		<a href="${imgs.imgUrl!}" data-gallery="">
		                                        <img src="${imgs.imgUrl!}">
		                                    </a>
	                                	</#list>
                                	</#if>
                                    <!-- <a href="../img/p1.jpg" data-gallery="">
                                        <img src="../img/p1.jpg">
                                    </a>
                                    <a href="../img/p2.jpg" data-gallery="">
                                        <img src="../img/p2.jpg">
                                    </a> -->
                                </div>
                            </div>
                        </div>
                        <div class="hr-line-dashed"></div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">备注</label>
                            <div class="col-sm-10">
                                <textarea class="form-control" rows="5" readonly>${orderDetail.remark!}</textarea>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- The Gallery as lightbox dialog, should be a child element of the document body -->
                <div id="blueimp-gallery" class="blueimp-gallery">
                    <div class="slides"></div>
                    <h3 class="title"></h3>
                    <a class="prev">‹</a>
                    <a class="next">›</a>
                    <a class="close">×</a>
                    <a class="play-pause"></a>
                    <ol class="indicator"></ol>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- blueimp gallery -->
<link href="${baseUrl}/css/plugins/blueimp/css/blueimp-gallery.min.css" rel="stylesheet">
<script src="${baseUrl}/js/plugins/blueimp/jquery.blueimp-gallery.min.js"></script>
<script>
    $(document).ready(function () {

    })
</script>
</@body.page>
</html>